import { createModel } from 'hox';
import { useLocalStorageState } from '@umijs/hooks';
import {
  getAllFsuType,
  setCurrentType,
  deleteFsuType,
  addFsuType,
  updateFsuType,
  queryLogo,
  logoUpload,
} from './service.js';
import { useRequest } from '@umijs/hooks';
import { message, Form } from 'antd';
import React, { useEffect, useState, useMemo, useReducer } from 'react';

class Fields {
  visible = false;
  isAdd = false;
  fsuTypeItem = {};
  enumVisible = false;
  selectDevTypeName = '';

  fields = [
    {
      name: ['name'],
      value: '',
    },
    {
      name: ['mask'],
      value: '',
    },
    {
      name: ['suIp'],
      value: '',
    },
  ];
  imageUrl = '';
}
const reducer = (state, action) => {
  switch (action.type) {
    case 'updateState':
      return { ...state, ...action.payload };
    default:
      throw new Error();
  }
};

function useDeviceType() {
  const [currentDeviceType, selectDeviceType] = useLocalStorageState('deviceType');
  const initState = useMemo(() => new Fields(), []);

  const [state, dispatch] = useReducer(reducer, {
    ...initState,
  });
  const setState = payload => {
    dispatch({ type: 'updateState', payload: { ...payload } });
  };

  const { loading, run, data } = useRequest(getAllFsuType, {
    manual: true,
    cacheKey: 'allFsuType',
    onSuccess: (result, params) => {},
  });
  const queryLogoProps = useRequest(queryLogo, {
    manual: true,
    onSuccess: (res, params) => {
      if (res.result) {
        if (res.data) {
          setState({ imageUrl: res.data + `?${Math.random()}` });
        } else {
          setState({ imageUrl: '' });
        }
      } else {
        message.error(res.msg);
      }
    },
  });
  //导入logo
  const logoUploadProps = useRequest(logoUpload, {
    manual: true,
    onSuccess: (res, params) => {
      if (res.result) {
        message.success('导入成功！');
      } else {
        message.error(res.msg);
      }
    },
  });

  //
  const setCurrentTypeProps = useRequest(setCurrentType, {
    manual: true,
    onSuccess: (res, params) => {
      if (res.result) {
      } else {
        message.error(res.msg);
      }
    },
  });
  const addProps = useRequest(addFsuType, {
    manual: true,
    onSuccess: (res, params) => {
      if (res.result) {
        run();
      } else {
        message.error(res.msg);
      }
    },
  });
  const updateProps = useRequest(updateFsuType, {
    manual: true,
    onSuccess: (res, params) => {
      if (res.result) {
        selectDeviceType({ ...params[0] });
        run();
      } else {
        message.error(res.msg);
      }
    },
  });

  const deleteProps = useRequest(deleteFsuType, {
    manual: true,
    onSuccess: (res, params) => {
      if (res.result) {
        message.success('删除成功！');
        if (params[0].id === currentDeviceType.id) {
          selectDeviceType(null);
        }

        run();
      } else {
        message.error('删除失败！');
      }
    },
  });
  useEffect(() => {
    run();
  }, []);

  return {
    state: {
      ...state,
      currentDeviceType,
      data: data?.data || [],
      updateProps,
      logoUploadProps,
      addProps,
      queryLogoProps,
      deleteProps,
      setCurrentTypeProps,
    },
    setState,
    form: Form.useForm(),
    selectDeviceType,
  };
}

export default createModel(useDeviceType);
